<template>
  <div class="page-lawopinion">
     <div><img src="../../public/imgs/icp/low_banner.jpg" alt="" style="width:100%"></div>
     <div class="content">
        <div class="item">
          <div class="item_left">
             <img src="../../public/imgs/icp/low_icon_2.png" alt="">
          </div>
          <div class="item_right">
           <div class="title">什么是法律意见书</div>
           <div class="des">网贷法律意见书，是律师对网贷机构的各项合法合规条件，逐项发表的明确法律结论性意见。<br/>
            <span>法律意见书是网贷机构进行备案登记时不可或缺的材料之一。</span></div>
          </div>
        </div>
         <div class="item">
          <div class="item_left">
             <img src="../../public/imgs/icp/low_icon_1.png" alt="">
          </div>
          <div class="item_right">
           <div class="title">法律意见书涵盖层面</div>
           <div class="des">法律意见书涵盖内容包括：提交的申请备案文件资料真实性、工商登记情况、股权结构、实际控制人、运营基本设施和条件、管理审核制度、业务模式、合法合规情况等。<br/>
            </div>
          </div>
        </div>
         <div class="item">
          <div class="item_left">
             <img src="../../public/imgs/icp/low_icon_3.png" alt="">
          </div>
          <div class="item_right">
           <div class="title">法律意见书的获取流程</div>
           <div class="des"><span>协议签署 → 尽职调查 → 完成</span><br/>优选理财签约高朋律师事务所，现律所已尽职调查完成，成功出具法律意见书，这是优选理财在拥抱监管、合规前行之路上的又一大进展。
            </div>
          </div>
        </div>        
     </div>
   
    <div class="low_title testImg1">
       高朋律师事务所签约图
    </div>
  
    <div class="img_content">
       <img :src="imglist[0]" alt=""  @click="zoom(imglist[0])">
         <img :src="imglist[1]" alt=""  @click="zoom(imglist[1])">
         <div class="empt"></div>
    </div>

      <div class="low_title">
       法律意见书图
    </div>
    <div class="img_content">
       <img :src="imglist[2]" alt=""  @click="zoom(imglist[2])">
         <img :src="imglist[3]" alt=""  @click="zoom(imglist[3])">
         <div class="empt"></div>
    </div>

    <div class="mask" v-show="iszoom"  @click="iszoom=!iszoom">
        <img :src="isselect" alt=""  :class="{'scale':iszoom}" @click="iszoom=!iszoom">
    </div>
  </div>
</template>

<script>

export default {
  name: "compliance",
  data() {
    return {
    imglist: [
        require("@/public/imgs/icp/low_list_1.png"),
        require("@/public/imgs/icp/low_list_2.png"),
         require("@/public/imgs/icp/low_list_3.png"),
        require("@/public/imgs/icp/low_list_4.png"),
       
      ],
      iszoom:false,
      isselect:"",
    };
  },
    computed: {
    
  },
  methods: {
  zoom(url){
    this.iszoom=true;
    this.isselect=url
  }
  },
  mounted() {

   
  }
};
</script>

<style lang="less">
body,html{
  background: #fff;
    -webkit-overflow-scrolling:touch; 
}
.page-lawopinion{
 .mask{
   position: fixed;
   width: 100%;
   height: 100%;
   left: 0;
   right: 0;
   top: 0;
   bottom: 0;
   background: rgba(0,0,0,0.5);
   overflow: hidden;
 }
  img {
    transform: scale(1);
    transition: all ease 0.2s;
}

img.scale {
   position: absolute;
  padding: 0px 10px;
   z-index: 999;
   top: 50%;
   left: 50%;
   transform:translate3d(-50%,-50%,0)    
}
  -webkit-overflow-scrolling:touch; 
  .content{
    padding: 50px 25px;
    .item{
      display: flex;
      margin-bottom: 40px;
      .item_left{
        margin-right: 35px;
        img{
          max-width:inherit;
          width: 31px;
          height: 29px;
        }
      }
      .item_right{
        .title{
          font-size: 36px;
          font-weight: 600;
          color: #333;
        }
        .des{
          margin-top: 30px;
          font-size: 26px;
          color: #666;
          line-height: 45px;
          span{
            color: #00266b;
          }
        }
      }
    }
  }
  .low_title{
    padding: 0px 40px;
    font-weight: bold;
    font-size: 32px;
  }
  .img_content{
    display: flex;
    overflow: scroll;
    padding: 35px 0px;
    padding-left: 100px;
    position: relative;
    img{
     margin-right: 30px;
       width: 380px;
       height: 507px;;
       border: 1Px solid #dcdcdc;
    }
    .empt{
      padding: 40px;
    }
  }
}
</style>
